<template>
    <div>
        <table class="table">
            <tbody>
                <tr>
                    <th>用户名称</th>
                    <th>
                        <input type="text" v-model="data.Name">
                    </th>
                </tr>
                <tr>
                    <th>手机号</th>
                    <th>
                        <input type="text" v-model="data.Phone">
                    </th>
                </tr>
                <tr>
                    <th>房型</th>
                    <th>
                        <select v-model="data.TypeId">
                            <option value="0">==请选择==</option>
                            <option v-for="a in datatype" :value="a.TypeId">{{ a.TypeName }}</option>
                        </select>
                    </th>
                </tr>
                <tr>
                    <th>照片</th>
                    <th>
                        <input type="file" @change="Upfile">
                        <img :src="'https://localhost:7119/'+data.img" width="100" height="100">
                    </th>
                </tr>
                <tr>
                    <th>状态</th>
                    <th>
                        <input type="radio" name="state" v-model="data.State" :value="true">上架
                        <input type="radio" name="state" v-model="data.State" :value="false">下架
                    </th>
                </tr>
                <tr>
                    <th colspan="2">
                        <input type="button" value="保存" @click="Add">
                    </th>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
    import { ref,onMounted } from 'vue';
    import axios from 'axios';
    import { useRouter } from 'vue-router';
    const router = useRouter()
    const data = ref({
    "Id": 0,
    "Name": "",
    "Phone": "",
    "TypeId": 0,
    "isDel": true,
    "img": "",
    "State": true
    })
    const datatype = ref([{
        "TypeId": 0,
        "TypeName": ""
    }])
    onMounted(()=>{
        Find()
    })
    const Find=()=>{
        axios.post("https://localhost:7119/api/Store/GetStoreType").then(res=>{
            datatype.value = res.data
        })
    }
    const Upfile=(e:any)=>{
        var f = e.target.files[0];
        if(f.size>1*1024*1024){
            alert('图片不能超过1MB')
            return
        }
        if(f.type!="image/png"&&f.type!="image/jpeg"){
            alert('格式请用jpg，png')
            return
        }
        var fd = new FormData();
        fd.append("file",f);
        axios.post("https://localhost:7119/api/Store/UpFile",fd).then(res=>{
            data.value.img = res.data
        })
    }
    const Add=()=>{
        
        axios.post("https://localhost:7119/api/Store/AddStore",data.value).then(res=>{
            if(res.data>0){
                alert('添加成功')
                router.push({path:"/"})
            }
            else{
                alert('添加失败')
            }
        })
    }
</script>

<style scoped>

</style>